<template>
  <div class="tableShopBox"><!--表格 商品信息组件-->
     	<div class="goodsBox" style="margin-bottom:10px" >
	      <div class="img">
	        <el-image :src="img" fit="fill" v-image-preview></el-image>
	      </div>
	      <div class="goodsRight">
	        <div class="goodsName color-444 ellipsis-item font-size-13" style="margin:7px 0 8px 0">{{goodsName}}</div>
	        <div class="goodsLabel d-flex">
	          <div class="color-999 d-flex margin-right-10 font-size-13">单价:{{goodsInfo.salePrice}}</div>
	          <div class="color-999 d-flex font-size-13">数量:{{goodsInfo.goodsNum?goodsInfo.goodsNum:'1'}}</div>
	        </div>
	      </div>
	      <!-- <div class="shopMore" v-if="isMore && index=='0'" @click="handleOpen">更多 <i :class="open?'el-icon-arrow-up':'el-icon-arrow-down'" style="color: #61997A;"></i></div> -->
	    </div>
  </div>
</template>

<script>
 export default {
   name: "tableShopBox",
   props: ['row'],
   data(){
     return{
      goodsInfo:{},
      img:'',
      goodsName:'',
     	isMore:false,
     	open:false,
     }
   },
   watch:{
     row(){
        this.dataInfo();
     }
   },
   mounted() {
      this.dataInfo();
   },
   methods:{
     dataInfo(){
       this.goodsInfo = this.row;
       this.goodsInfo.goodsInfo = typeof(this.goodsInfo.goodsInfo)=='object'?this.goodsInfo.goodsInfo:JSON.parse(this.goodsInfo.goodsInfo);
       this.img = this.goodsInfo.goodsInfo.picLibUrl + this.goodsInfo.goodsInfo.big;
       if(!this.img){
         this.img = this.goodsInfo.goodsInfo.goodsImg.img
       }
       this.goodsName = this.goodsInfo.goodsInfo.goodsName;
     },
		handleOpen(){
			this.open = !this.open
		}
   }
 }
</script>

<style lang="scss" scoped>
    .shopMore{
      cursor: pointer;
      display: flex;
      align-items: center;
      margin-left:10px;
      color: #61997A;
    }
</style>
